<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
        <title>该页面不存在</title>
        <script src="https://cdn.bootcss.com/jquery/2.2.0/jquery.min.js"></script>
    </head>
    <style>
        .content{width:800px;margin:110px auto 0px;}
        .content:after{content:"";display: block;clear: both;height:0;visibility: hidden}
        .Img404{text-align: center;float:left}
        .Img404 img{}
        .imgCon{float:left;position: relative;margin:100px 0px 0px 30px;}
        .imgCon h4{color:#2cb7fd;font-size: 20px;line-height:25px;}
        .imgCon p{color:#666;}
        .imgCon>div{margin-top:30px;}
        .imgCon a{display: inline-block;width:120px;padding: 10px 0px;margin:0px 20px 0px 0px;border: 1px solid #2cb7fd;font-size: 15px;color: #2cb7fd;text-decoration: none;}
        .imgCon a.back{color:#fff;background:#2cb7fd;}
        @media only screen and (max-width:800px) {
            .content {width: 100%;margin: 30px auto 0px;}
            .Img404,.imgCon{float:inherit}
            .Img404 img{max-height:350px;}
            .imgCon{margin:0px;text-align: center}
        }
        @media only screen and (max-width:480px) {
            .Img404 img{max-height:280px;}
        }
    </style>
    <body>
    <div class="content">
        <div class="Img404"><img src="${ctxPath}/static/h/images/404.png" /></div>
        <div class="imgCon">
            <h4>很抱歉！没有找到您要访问的页面！</h4>
            <p><span id="num">5</span> 秒后将自动跳转到首页</p>
            <div>
                <a href="/" title="返回首页" class="back">返回首页</a>
                <a href="javascript:;" title="上一步" id="reload-btn">上一步</a>
            </div>
        </div>

    </div>
    <script>
        //倒计时跳转到首页的js代码
        var $_num=$("#num");
        var num=parseInt($_num.html());
        var numId=setInterval(function(){
            num--;
            $_num.html(num);
            if(num===0){
                //跳转地址写在这里
                window.location.href="/";
            }
        },1000);
        //返回按钮单击事件
        var reloadPage = $("#reload-btn");
        reloadPage.click(function(e){
            window.history.back();
        });
    </script>

    </body>
</html>